"use strict";

import React from "react";
import { Link,browserHistory } from "react-router" ;
import { connect } from "react-redux" ;
// import { mapStateToProps,mapDispatchToProps }from "./HeaderRedux"
//style
import "./Header.scss" ;
//images
import logo from "../../../static/img/h5/logo-h5.jpg";
import head from "../../../static/img/h5/head.png"
import yellowIcon from "../../../static/img/film/geren-V.png";
import greenIcon from "../../../static/img/film/qite-V.png";
import NetworkEngine from "../../../utils/NetworkEngine" ;
import UrlManager from "../../../utils/UrlManager" ;


class Header extends React.Component{
    constructor(props){
        super(props) ;
        this.state = {
        }

    }

    componentDidMount() {
        this.getAuth();
    }
    /* 得到认证信息 */
    getAuth() {
        let urlManager = new UrlManager();
        NetworkEngine(
            "post",
            urlManager.reAuthentication(), {
                userId:sessionStorage.getItem("id"),
                userKeyId:sessionStorage.getItem("userKeyId"),
            }
        ).then(
            data => {
                let auth = data.data;
                let status = 0;
                if (auth.data.status == 1) {
                    status = 4;
                } else if (auth.data.status == 4) {
                    status = 4;
                }
                this.setState({
                    type: auth.data.type,
                    authenticationStatus: status + ''
                })
            }
        ).catch(
            err => {
                //失败执行
            }
        )
    }

    //进入个人主页
    queryCreator() {
        console.log("======userId======",sessionStorage.getItem("id"));
        localStorage.setItem("personalId",sessionStorage.getItem("id"));
        var id = localStorage.getItem('personalId').replace(/\//g, '_').replace(/\+/g, '_').replace(/\=/g, '');
        var viewerKey = sessionStorage.getItem("viewerKey");
        if(viewerKey == null || viewerKey == ""){
            viewerKey = "0";
        }
        browserHistory.push("/App/MobileMine/"+id+'/'+viewerKey);
        window.scrollTo(0,0);
    }
    MobileHome() {
        MtaH5.clickStat('h5_select');
        browserHistory.push("/App/MobileHome");
    }
    MobileDemand() {
        MtaH5.clickStat('h5_demandlist');
        browserHistory.push("/App/MobileDemand");
    }
    render(){
        return(
            <header className="h5-header">
                <table>
                    <tbody>
                    <tr>
                        <td>
                            <img src={logo} alt="咪吱logo" className="logo" />
                        </td>
                        <td>
                            <div className="mobile-home"
                                  onClick={(event) => { this.MobileHome(this)}}>精品</div>
                        </td>
                        <td>
                            <div className="mobile-demand"
                                  onClick={(event) => { this.MobileDemand(this)}}>需求大厅</div>
                        </td>
                        <td>

                            {
                                (sessionStorage.getItem('id')) ?
                                    <div className='img-need'>
                                        <img
                                            src={sessionStorage.getItem("headUrl").length>4 ? sessionStorage.getItem("headUrl"):head}
                                            className="img-head"
                                            onClick={this.queryCreator.bind(this)} />
                                        {(this.state.authenticationStatus === "1" || this.state.authenticationStatus === "4")
                                        && <img className="img-type"
                                                src={this.state.type == 0 ? yellowIcon : greenIcon}/>}
                                    </div>
                                    :<div className="Ann-head"></div>
                            }

                        </td>
                    </tr>
                    </tbody>
                </table>
        </header>
            )
    }
}

// const Header = connect(mapStateToProps,mapDispatchToProps)(HeaderContainer) ;

export { Header as default } ;

